var vm = new Vue({
    el: '#rrapp',
    data: {
        ////////////////////////👇👇👇👇关键变量👇👇👇👇///////////////////////
        pageTotal: 10,
        //当前页
        currentPage: 1,
        //总数
        total: null,
        //一页显示的数量
        size: 10,
        //选中的行的ids
        selectColumnIds: [],
        //选中的对象
        selectColumnObjects: [],
        showFrom: false,
        dialogFormVisible: false,
        labelPosition: "right",
        //数据图对象
        option: {},
        showData: {},
        //查询参数
        params: {keyword: ""},
        ////////////////////////👆👆👆👆👆关键变量👆👆👆👆//////////////////////
        dialogVisible: false,
        tableData: [],
        sysRole: {},
        showList: true,
        title: null,
        allMenu: [],
        selectMenuId: [],
        rules: {
            roleName: [
                {required: true, message: '名称不能为空', trigger: 'blur'},
                {min: 3, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur'}
            ],
        },
        defaultProps: {
            children: 'list',
            label: 'label'
        }
    },

    methods: {
        add: function () {
            vm.sysRole = {};
            vm.dialogFormVisible = true;
            vm.getAllMenu();
        },
        getAllMenu: function () {
            //sys/menu
            Ajax.request({
                url: "../sys/menu/user",
                type: 'get',
                successCallback: function (r) {
                    vm.allMenu = r.data;
                }
            });

        },
        saveOrUpdate: function (formName) {
            let selectId =this.$refs.tree.getCheckedKeys();
            if (selectId.length<1){
                vm.$message({
                    type: 'warning',
                    message: '请选择菜单'
                });
            }
            vm.dialogFormVisible = false;
            let url;
            if (vm.sysRole.id != null) {
                url = "../sys/sysRole/update"
            } else {
                url = "../sys/sysRole/save"
            }
            vm.sysRole.menuIdList = selectId;
            Ajax.request({
                url: url,
                params: JSON.stringify(vm.sysRole),
                contentType: "application/json",
                type: 'POST',
                successCallback: function () {
                    vm.$message({
                        type: 'info',
                        message: '操作成功'
                    });
                }
            });

            vm.reload();
        },
        deleteBatch: function (id) {
            let ids;
            if (typeof id == "number") {
                ids = [id];
            } else {
                ids = vm.getSelectIds();
            }

            this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                Ajax.request({
                    url: "../sys/sysRole/delete",
                    params: JSON.stringify(ids),
                    contentType: "application/json",
                    type: 'POST',
                    successCallback: function () {
                    }
                });
                this.$message({
                    type: 'success',
                    message: '删除成功!'
                });
                vm.reload();
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            })
        },

        getInfo: function (id) {
            Ajax.request({
                url: "../sys/sysRole/info/" + id,
                type: 'get',
                successCallback: function (r) {
                    vm.sysRole = r.data;
                }
            });
        },
        handleEdit: function (index, row) {
            vm.sysRole={},
                vm.getAllMenu();
            vm.getInfo(row.id);
            vm.dialogFormVisible = true;
        },
        handleDelete: function (id, row) {
            vm.deleteBatch(id);
        },


/////////////////👇👇👇👇👇👇👇👇关键方法（无须改动）👇👇👇👇👇👇👇👇👇////////////////////
        query: function () {
            vm.reload();
        },
        reset: function () {
            vm.params.keyword = "";
            vm.reload();
        },
        resetForm(formName) {
            //生成后需要放开注释
            this.$refs[formName].resetFields();
            vm.dialogFormVisible = false;
        },
        ruleFrom: function (formName) {
            //生成后需要放开注释
            vm.$refs[formName].validate((valid) => {
                if (valid) {
                    this.saveOrUpdate();
                } else {
                    console.log('error submit!!');
                    return;
                }
            });
        },
        reload: function () {
            vm.getData();
        },
        /**
         * 获取当前行对象
         * @returns {*}
         */
        getOneObject() {
            if (vm.selectColumnObjects.length !== 1) {
                this.$message('请选中一条记录');
                return
            }
            return vm.selectColumnObjects[0];
        },
        /**
         * 获取当前行id
         * @returns {*}
         */
        getOneId() {
            if (vm.selectColumnObjects.length !== 1) {
                this.$message('请选中一条记录');
                return
            }
            return vm.selectColumnObjects[0].id;
        },
        /**
         * 获取选中行的对象
         * @param rows
         */
        selectionRowsChange: function (rows) {
            vm.selectColumnObjects = rows;
            if (rows) {
                vm.selectColumnIds = rows.map(row => {
                    return row.id;
                })
            }
            return vm.selectColumnObjects;
        },
        /**
         * 获取选中行的ids
         */
        getSelectIds: function () {
            if (vm.selectColumnIds.length < 1) {
                this.$message('请选择');
                throw '请选择'
                // return
            }
            return vm.selectColumnIds;
        },
        /**
         * 页数更换
         * @param size
         */
        handleSizeChange: function (size) {
            vm.size = size;
        },
        /**
         * 点击行时触发
         * @param row
         * @param event
         * @param column
         */
        handleRowChange: function (row, event, column) {
            if (row) {
                this.$refs.multipleTable.toggleRowSelection(row);
            } else {
                this.$refs.multipleTable.clearSelection();
            }
        },
        /**
         * 页数更换
         * @param page
         */
        currentChange: function (page) {
            vm.currentPage = page;
        },
        /**
         * 获取列表数据
         */
        getData: function () {
            let queryParams = "&keyword=" + this.params.keyword;
            let rowdata;
            let params = "?page=" + this.currentPage + "&limit=" + this.size + queryParams;
            console.log(this);
            Ajax.request({
                url: "../sys/sysRole/list" + params,
                successCallback: function (r) {
                    rowdata = r;
                }
            });
            this.tableData = rowdata.data.records;
            this.total = rowdata.data.total;
            this.currentPage = rowdata.data.current;
            this.size = rowdata.data.size;
        },
        getShowData: function () {
            let _showData;
            Ajax.request({
                url: "../sys/sysRole/data",
                successCallback: function (r) {
                    _showData = r.data;
                }
            });
            this.showData = _showData;
        }
/////////////////////👆👆👆👆👆👆👆👆关键方法（无须改动）👆👆👆👆👆👆👆/////////////
    },
    mounted: function () {
        this.getData();
        this.getShowData();
        // this.echartsInfo();
    },
    created() {

    }
});